import { Switch, Route, useHistory } from 'react-router-dom'
import Service from './Service'
import Client from './Client'
import InfiniteList from './InfiniteList'
import Car from './Car'

import './styles.less'

function index() {
  const history = useHistory()
  return (
    <div className="docwrap layout">
      <div className="nav-list">
        <div
          className="nav"
          onClick={() => {
            history.push('/member/service')
          }}
        >
          聊天-客服端
        </div>
        <div
          className="nav"
          onClick={() => {
            history.push('/member/client')
          }}
        >
          聊天-客户端
        </div>
        <div
          className="nav"
          onClick={() => {
            history.push('/member/infinite_list')
          }}
        >
          无限下拉
        </div>
        <div
          className="nav"
          onClick={() => {
            history.push('/member/car')
          }}
        >
          购物车
        </div>
      </div>
      <div className="concent">
        <Switch>
          <Route path="/member/service" component={Service} />
          <Route path="/member/client" component={Client} />
          <Route path="/member/infinite_list" component={InfiniteList} />
          <Route path="/member/car" component={Car} />
        </Switch>
      </div>
    </div>
  )
}

export default index
